// 主题配色变量文件

// 樱花主题
:root[data-theme="cherry"] {
  /* 主菜单配色 */
  --menu-bg-color: #e6b8d6; /* 樱花色背景 */
  --menu-text-color: #5a4a5a; /* 深棕紫色文字 */
  --menu-border-color: rgba(90, 74, 90, 0.2); /* 边框颜色 */
  --menu-hover-bg: rgba(220, 20, 60, 0.15); /* 悬停背景 - 淡粉色 */
  --menu-active-bg: rgba(219, 112, 147, 0.4); /* 激活背景 - 古粉色 */
  --menu-indicator-color: #ff69b4; /* 指示器颜色 - 热粉色 */

  /* 子菜单配色 */
  --submenu-bg-color: #fdf2f8; /* 子菜单背景 - 非常淡的粉色 */
  --submenu-header-bg: #f8e8f5; /* 子菜单头部背景 */
  --submenu-text-color: #5a4a5a; /* 子菜单文字颜色 */
  --submenu-hover-bg: #f3e8ff; /* 子菜单悬停背景 */
  --submenu-active-bg: #e879f9; /* 子菜单激活背景 */
  --submenu-active-text: #ffffff; /* 子菜单激活文字 */

  /* 首页配色 */
  --home-primary-color: #e6b8d6; /* 主色调 */
  --home-secondary-color: #d19bc7; /* 次要色调 */
  --home-bg-light: #faf6f9; /* 浅背景色 */
  --home-bg-lighter: #faf8fb; /* 更浅背景色 */
  --home-bg-card: #f4f0f5; /* 卡片背景色 */
  --home-border-color: #e6b8d6; /* 边框色 */
  --home-border-hover: #d19bc7; /* 悬停边框色 */
  --home-shadow-color: rgba(230, 184, 214, 0.08); /* 阴影色 */
  --home-shadow-hover: rgba(230, 184, 214, 0.15); /* 悬停阴影色 */
}

// 薰衣草主题
:root[data-theme="lavender"] {
  /* 主菜单配色 */
  --menu-bg-color: #dda0dd; /* 薰衣草色背景 */
  --menu-text-color: #4a4a4a; /* 深灰色文字 */
  --menu-border-color: rgba(74, 74, 74, 0.2); /* 边框颜色 */
  --menu-hover-bg: rgba(138, 43, 226, 0.15); /* 悬停背景 */
  --menu-active-bg: rgba(138, 43, 226, 0.3); /* 激活背景 */
  --menu-indicator-color: #9370db; /* 指示器颜色 */

  /* 子菜单配色 */
  --submenu-bg-color: #f8f4ff; /* 子菜单背景 */
  --submenu-header-bg: #f0e6ff; /* 子菜单头部背景 */
  --submenu-text-color: #4a4a4a; /* 子菜单文字颜色 */
  --submenu-hover-bg: #e6d7ff; /* 子菜单悬停背景 */
  --submenu-active-bg: #9370db; /* 子菜单激活背景 */
  --submenu-active-text: #ffffff; /* 子菜单激活文字 */

  /* 首页配色 */
  --home-primary-color: #dda0dd; /* 主色调 */
  --home-secondary-color: #c19ad4; /* 次要色调 */
  --home-bg-light: #f8f4ff; /* 浅背景色 */
  --home-bg-lighter: #faf8ff; /* 更浅背景色 */
  --home-bg-card: #f0e6ff; /* 卡片背景色 */
  --home-border-color: #dda0dd; /* 边框色 */
  --home-border-hover: #c19ad4; /* 悬停边框色 */
  --home-shadow-color: rgba(221, 160, 221, 0.08); /* 阴影色 */
  --home-shadow-hover: rgba(221, 160, 221, 0.15); /* 悬停阴影色 */
}

// 薄荷主题
:root[data-theme="mint"] {
  /* 主菜单配色 */
  --menu-bg-color: #c7f0db; /* 薄荷绿背景 */
  --menu-text-color: #2d5a3d; /* 深绿色文字 */
  --menu-border-color: rgba(45, 90, 61, 0.2); /* 边框颜色 */
  --menu-hover-bg: rgba(34, 139, 34, 0.15); /* 悬停背景 */
  --menu-active-bg: rgba(60, 179, 113, 0.4); /* 激活背景 */
  --menu-indicator-color: #00fa9a; /* 指示器颜色 */

  /* 子菜单配色 */
  --submenu-bg-color: #f0fff4; /* 子菜单背景 */
  --submenu-header-bg: #e6ffe6; /* 子菜单头部背景 */
  --submenu-text-color: #2d5a3d; /* 子菜单文字颜色 */
  --submenu-hover-bg: #ccffcc; /* 子菜单悬停背景 */
  --submenu-active-bg: #32cd32; /* 子菜单激活背景 */
  --submenu-active-text: #ffffff; /* 子菜单激活文字 */

  /* 首页配色 */
  --home-primary-color: #c7f0db; /* 主色调 */
  --home-secondary-color: #a8e6c1; /* 次要色调 */
  --home-bg-light: #f0fff4; /* 浅背景色 */
  --home-bg-lighter: #f8fff8; /* 更浅背景色 */
  --home-bg-card: #e6ffe6; /* 卡片背景色 */
  --home-border-color: #c7f0db; /* 边框色 */
  --home-border-hover: #a8e6c1; /* 悬停边框色 */
  --home-shadow-color: rgba(199, 240, 219, 0.08); /* 阴影色 */
  --home-shadow-hover: rgba(199, 240, 219, 0.15); /* 悬停阴影色 */
}

// 海洋主题
:root[data-theme="ocean"] {
  /* 主菜单配色 */
  --menu-bg-color: #b0e0e6; /* 海蓝色背景 */
  --menu-text-color: #2c5aa0; /* 深海蓝文字 */
  --menu-border-color: rgba(44, 90, 160, 0.2); /* 边框颜色 */
  --menu-hover-bg: rgba(30, 144, 255, 0.15); /* 悬停背景 */
  --menu-active-bg: rgba(70, 130, 180, 0.4); /* 激活背景 */
  --menu-indicator-color: #00bfff; /* 指示器颜色 */

  /* 子菜单配色 */
  --submenu-bg-color: #f0f8ff; /* 子菜单背景 */
  --submenu-header-bg: #e6f3ff; /* 子菜单头部背景 */
  --submenu-text-color: #2c5aa0; /* 子菜单文字颜色 */
  --submenu-hover-bg: #cce7ff; /* 子菜单悬停背景 */
  --submenu-active-bg: #1e90ff; /* 子菜单激活背景 */
  --submenu-active-text: #ffffff; /* 子菜单激活文字 */

  /* 首页配色 */
  --home-primary-color: #b0e0e6; /* 主色调 */
  --home-secondary-color: #87ceeb; /* 次要色调 */
  --home-bg-light: #f0f8ff; /* 浅背景色 */
  --home-bg-lighter: #f8fcff; /* 更浅背景色 */
  --home-bg-card: #e6f3ff; /* 卡片背景色 */
  --home-border-color: #b0e0e6; /* 边框色 */
  --home-border-hover: #87ceeb; /* 悬停边框色 */
  --home-shadow-color: rgba(176, 224, 230, 0.08); /* 阴影色 */
  --home-shadow-hover: rgba(176, 224, 230, 0.15); /* 悬停阴影色 */
}

// 默认主题（樱花主题作为默认）
:root {
  /* 主菜单配色 */
  --menu-bg-color: #e6b8d6; /* 樱花色背景 */
  --menu-text-color: #5a4a5a; /* 深棕紫色文字 */
  --menu-border-color: rgba(90, 74, 90, 0.2); /* 边框颜色 */
  --menu-hover-bg: rgba(220, 20, 60, 0.15); /* 悬停背景 - 淡粉色 */
  --menu-active-bg: rgba(219, 112, 147, 0.4); /* 激活背景 - 古粉色 */
  --menu-indicator-color: #ff69b4; /* 指示器颜色 - 热粉色 */

  /* 子菜单配色 */
  --submenu-bg-color: #fdf2f8; /* 子菜单背景 - 非常淡的粉色 */
  --submenu-header-bg: #f8e8f5; /* 子菜单头部背景 */
  --submenu-text-color: #5a4a5a; /* 子菜单文字颜色 */
  --submenu-hover-bg: #f3e8ff; /* 子菜单悬停背景 */
  --submenu-active-bg: #e879f9; /* 子菜单激活背景 */
  --submenu-active-text: #ffffff; /* 子菜单激活文字 */

  /* 首页配色 */
  --home-primary-color: #e6b8d6; /* 主色调 */
  --home-secondary-color: #d19bc7; /* 次要色调 */
  --home-bg-light: #faf6f9; /* 浅背景色 */
  --home-bg-lighter: #faf8fb; /* 更浅背景色 */
  --home-bg-card: #f4f0f5; /* 卡片背景色 */
  --home-border-color: #e6b8d6; /* 边框色 */
  --home-border-hover: #d19bc7; /* 悬停边框色 */
  --home-shadow-color: rgba(230, 184, 214, 0.08); /* 阴影色 */
  --home-shadow-hover: rgba(230, 184, 214, 0.15); /* 悬停阴影色 */
}
